<template>
  <div class="detail">
    <template v-for="v,detailIndex in detail">
      <div
        class="detail-bg"
        :key="detailIndex"
        v-show="$route.query.type == (detailIndex+1).toString() && $route.query.type !==4"
      >
        <swiper
          ref="mySwiper"
          :options="swiperOptions"
        >
          <swiper-slide
            v-for="vimg,imgIndex in v.topImg"
            :key="imgIndex"
          >
            <van-image
              class="swiper-img"
              :src="vimg.image"
              cover
            ></van-image>
          </swiper-slide>
          <div
            class="swiper-pagination"
            slot="pagination"
          ></div>
        </swiper>

        <div class="content">
          <div class="title">
            {{v.name}}
          </div>
          <div class="desc">
            {{v.desc}}
          </div>

          <div class="detail-tab">
            <van-tabs v-model="active">
              <van-tab title="概述">
                <div
                  class="overview"
                  v-html="v.overview.txt"
                >
                </div>
                <div>
                  <div class="overview-img">
                    <van-image
                      class="img"
                      :src="v.overview.img"
                    ></van-image>
                  </div>
                </div>
              </van-tab>
              <van-tab title="检测优势">
                <div
                  class="advantage"
                  v-if="v.advantage.lists.length !== 0"
                >
                  <div class="advantage-txt">
                    {{v.advantage.txt}}
                  </div>
                  <div class="advantage-table">
                    <div
                      class="advantage-table-item"
                      v-for="adv,advIndex in v.advantage.lists"
                      :key="advIndex"
                    >
                      <div>
                        <van-image
                          class="img"
                          :src="adv.img"
                        ></van-image>
                      </div>
                      <div
                        class="advantage-table-info"
                        :class="adv.act?'active':''"
                        v-html="adv.txt"
                      >
                      </div>
                    </div>
                  </div>
                </div>
                <div
                  class="advantage"
                  v-else
                >

                  <div class="advantage-txt">
                    {{v.advantage.txt}}
                  </div>
                  <div class="advantage-table">
                    <van-image
                      class="img"
                      :src="v.advantage.image"
                    ></van-image>
                  </div>
                </div>
              </van-tab>
              <van-tab title="参数">
                <div class="argument">
                  <div
                    class="argument-item"
                    v-for="arg,argIndex in v.argument"
                    :key="argIndex"
                  >
                    <div class="name">{{arg.name}}</div>
                    <div
                      class="content"
                      v-html="arg.content"
                    ></div>
                  </div>
                </div>
              </van-tab>
            </van-tabs>
          </div>
        </div>

        <div class="contact">
          <div>
            chip@liangzhun.com.cn
          </div>
          <div>
            (+086) 400 0150 560
          </div>
        </div>
      </div>
    </template>
    <div v-show="$route.query.type == '4'">
      <van-image
        cover
        class="swiper-img"
        :src="require('../../assets/detail/covid.jpeg')"
      ></van-image>
    </div>
  </div>
</template>

<script>
import { directive, Swiper, SwiperSlide } from "vue-awesome-swiper";
import "swiper/css/swiper.css";

export default {
  name: "",
  data() {
    return {
      current: 0,
      active: 0,
      detail: [
        {
          name: "量准 XLEMENT SPR100多功能蛋白及病毒检测仪",
          desc: "XLEMENT SPR100 Microplate Instrumentation",
          topImg: [
            {
              image: require("../../assets/detail/element1.jpg"),
            },
            {
              image: require("../../assets/detail/element2.png"),
            },
            {
              image: require("../../assets/detail/element3.jpg"),
            },
          ],
          overview: {
            txt:
              "<p>高通量快速的生物分子间亲和力鉴定 (可快速计算Ka，Kd，KD值)</p><p>高灵敏度NanoSPR-96孔板 具备常规酶标仪功能(如ELISA等光吸收检测) 先进的8光学通道设计，满足快速读数</p><ol><li>测量范围:0 - 4 OD；</li><li>分辨率: 0.0001 OD；</li><li>波⻓选择:标准滤光片 (405, 450, 492 and 620 nm)及SPR检测波⻓准确性 (450/492 nm) 0.000-2.000 OD: ≤ (0.5%+0.010OD); 2.000 -3.000 OD: ≤ (1 %+0.010 OD)；</li><li>精确度/可重复性 (450/492 nm) 0.000-2.000 OD: ≤ (0.5%+0.005 OD); 2.000 -3.000 OD: ≤ (1 %+ 0.005OD)；</li><li> 线性范围: 0.000-2.000 OD: ≤ 1.0%; 2.000 -3.000 OD: ≤ 1.5%。</li></ol>",
            img: require("../../assets/detail/element1.jpg"),
          },
          advantage: {
            txt: "公司专有的纳米等离子耦合共振免疫吸附法技术的优势。",
            lists: [
              {
                act: true,
                img: require("../../assets/detail/element2.png"),
                txt:
                  "<p>通过修饰96孔芯片，将待测样品的抗体事先固定在芯片表面，加入待测样品后，待测样品与固定在芯片表面的抗体发生互作，并通 过具有表面等离激元效应的芯片，实时地将抗体与抗原分子的结合量转化为透过芯片的特定光强，最终可得到其结合常数。适用范围：需定量分析生物分子结合能力的检测，如包括抗原抗体(肿瘤标志物、药物分子)筛选以及核算分子的结合动力学分析的检测;</p>",
              },
              {
                act: false,
                img: require("../../assets/detail/element3.jpg"),
                txt:
                  "<p>基于PITA法，可以无需修饰芯片，让待测样本与抗体直接在芯片表面反应，利用SPR100特有检测模式，可在低浓度环境下快速定量分析待测物浓度(灵敏度是常规免疫比浊法的 1000倍)。适用范围:微量蛋白测量及肿瘤标志物的检测。</p>",
              },
            ],
          },
          argument: [
            {
              name: "检测技术",
              content: "SPR生物传感器",
            },
            {
              name: "提供信息",
              content:
                "亲和力和动力学数据 (KD, ka, kd)，结合特异性，选择性，浓度",
            },
            {
              name: "数据显示",
              content: "结果表格， 结果图， 实时监测的感应图",
            },
            {
              name: "开机预热时间",
              content: "无",
            },
            {
              name: "每次分析时间",
              content: "常为 2-15 分钟",
            },
            {
              name: "样品类型",
              content:
                "在各种样品环境中(例如含有 DMSO 的缓冲液、血浆或血清)的低分子量 候选药物到 高分子量蛋白(另外包括 DNA、RNA、 多糖、脂类、细胞及病毒等)",
            },
            {
              name: "上样体积",
              content: "50 μl-100 μl",
            },
            {
              name: "所需样本体积",
              content: "50 μl-100 μl",
            },
            {
              name: "分析温度范围",
              content: "环境温度",
            },
            {
              name: "样品折射系数",
              content: "1.33–1.40",
            },
            {
              name: "结合速率常数(Ka)",
              content:
                "蛋白质: 10 3- 3 × 10 8 M -1 s -1， 低分子量分子: 10 3 -5 × 106 M -1 s -1",
            },
            {
              name: "解离速率常数(Kd)",
              content: "10 ̄5 - 1s ̄1",
            },
            {
              name: "样品浓度",
              content: "≥ 100 pM",
            },
            {
              name: "分子量测定",
              content: "对于有机分子，无最小分子量限制",
            },
            {
              name: "基线噪音",
              content: "通常 < 0.05 RU (RMS)",
            },
            {
              name: "基线漂移",
              content: "通常 < 0.3 RU/min",
            },
          ],
        },
        {
          name: "人免疫球蛋白IgG测定试剂盒",
          desc: "纳米等离子耦合共振免疫吸附法",
          topImg: [
            {
              image: require("../../assets/detail/conentration.png"),
            },
            {
              image: require("../../assets/detail/2_03.jpg"),
            },
            {
              image: require("../../assets/detail/2_06.jpg"),
            },
            {
              image: require("../../assets/detail/2_08.jpg"),
            },
          ],
          overview: {
            txt:
              "本试剂盒用于体外定量检测人血清/血浆中免疫球蛋白IgG含量。它使用我们专有的纳米等离子耦合共振免疫吸附法技术。样本中的IgG与试剂R2中的抗人IgG在试剂R1的缓冲液中反应，形成免疫结合物粒子，产生的结合物粒子与纳米孔芯片会发生等离子共振效应，在特定波长620 nm或630nm处引起吸光度的改变。该波长处的吸光度的高低在一定量抗人IgG存在时与样本中IgG的含量成正比。故可利用标准浓度的IgG生成的结合物粒子在纳米等离子芯片的620 nm或 630nm处的吸光度变化，建立吸光度变化值与浓度值的标准曲线，从而计算出未知浓度样本中的IgG含量。",
            img: require("../../assets/detail/conentration.png"),
          },
          advantage: {
            txt: "公司专有的纳米等离子耦合共振免疫吸附法技术的优势。",
            lists: [
              {
                act: true,
                img: require("../../assets/detail/2_03.jpg"),
                txt:
                  "<p>灵敏度高 <span>（NanoSPR放大效应，媲美Elisa）</span></p><p>操作简便 <span>（一步法）</span></p><p>检测时间短 <span>（5-30min）</span></p><p> <span>检测试剂种类少</span></p><p>试剂、样品用量少 </p><p><span>检测稳定性大幅提高</span></p><p>检测费用低</p><p>适用于普通酶标仪</p>",
              },
              {
                act: false,
                img: require("../../assets/detail/2_06.jpg"),
                txt:
                  "<p>灵敏度低</p><p>操作简便（一步法）</p><p>检测时间短（5-30min）</p><p>检测试剂种类少</p><p>试剂、样品用量适中</p><p>检测费用低</p><p>不适用于酶标仪</p>",
              },
              {
                act: false,
                img: require("../../assets/detail/2_08.jpg"),
                txt:
                  "<p>灵敏度高（酶促放大效应）</p><p>特异性强</p><p>操作步骤繁琐</p><p>检测时间长（> 5h）</p><p>检测试剂种类多</p><p>影响因素复杂</p><p>国产Elisa检测稳定性较差</p><p>检测费用昂贵</p>",
              },
            ],
          },
          argument: [
            {
              name: "检测方法",
              content: "纳米等离子耦合共振免疫吸附法",
            },
            {
              name: "空白吸光度",
              content:
                "以10mMTris-HCl为空白对照，计算试剂空白吸光度（OD）不大于0.005",
            },
            {
              name: "最低检出限",
              content: "当浓度 &lt; 0.001 mg/L时不能得到可重复的结果",
            },
            {
              name: "线性范围",
              content:
                "在0.01～1 mg/L范围内，剂量反应曲线线性相关系数应不低于0.9900；线性相对偏差不超过±15%",
            },
            {
              name: "前带效应",
              content:
                "当浓度&lt;1mg/L时无前带效应出现。如果样本浓度超过1 mg/L，则应以样本稀释液稀释成不同倍数后再重新测定，测定的结果值等于仪器检测值乘以稀释的倍数",
            },
            {
              name: "精密度",
              content: "批内精密度≤10%；批间精密度≤10%",
            },
            {
              name: "准确度",
              content: "测量结果的相对偏差应不超过±10%",
            },
            {
              name: "样品类型",
              content: "血清，肝素或EDTA抗凝血浆%",
            },
            {
              name: "检测类型",
              content: "定量",
            },
            {
              name: "检测时间",
              content: "约30min",
            },
            {
              name: "实验步骤",
              content: "一步法",
            },
          ],
        },
        {
          name: "超敏C-反应蛋白测定试剂盒",
          desc: "纳米等离子耦合共振免疫吸附法",
          topImg: [
            {
              image: require("../../assets/detail/1_03.jpg"),
            },
            {
              image: require("../../assets/detail/2_03.jpg"),
            },
            {
              image: require("../../assets/detail/2_06.jpg"),
            },
            {
              image: require("../../assets/detail/2_08.jpg"),
            },
          ],
          overview: {
            txt:
              "本试剂盒用于体外定量检测人血清/血浆中C反应蛋白含量。它使用我们专有的纳米等离子耦合共振免疫吸附法技术。 样本中的CRP与试剂R2中的抗人CRP在试剂R1的缓冲液中反应，形成免疫结合物粒子，产生的结合物粒子与纳米孔芯片会发生等离子共振效应，在特定波长620nm或630nm处引起吸光度的改变。该波长处的吸光度的高低在一定量抗人CRP存在时与样本中CRP的含量成正比。故可利用标准浓度的CRP生成的结合物粒子在纳米等离子芯片的620 nm或630 nm处的吸光度变化，建立吸光度变化值与浓度值的标准曲线，从而计算出未知浓度样本中的CRP含量。",
            img: require("../../assets/detail/1_03.jpg"),
          },
          advantage: {
            txt: "公司专有的纳米等离子耦合共振免疫吸附法技术的优势。",
            lists: [
              {
                act: true,
                img: require("../../assets/detail/2_03.jpg"),
                txt:
                  "<p>灵敏度高 <span>（NanoSPR放大效应，媲美Elisa）</span></p><p>操作简便 <span>（一步法）</span></p><p>检测时间短 <span>（5-30min）</span></p><p> <span>检测试剂种类少</span></p><p>试剂、样品用量少 </p><p><span>检测稳定性大幅提高</span></p><p>检测费用低</p><p>适用于普通酶标仪</p>",
              },
              {
                act: false,
                img: require("../../assets/detail/2_06.jpg"),
                txt:
                  "<p>灵敏度低</p><p>操作简便（一步法）</p><p>检测时间短（5-30min）</p><p>检测试剂种类少</p><p>试剂、样品用量适中</p><p>检测费用低</p><p>不适用于酶标仪</p>",
              },
              {
                act: false,
                img: require("../../assets/detail/2_08.jpg"),
                txt:
                  "<p>灵敏度高（酶促放大效应）</p><p>特异性强</p><p>操作步骤繁琐</p><p>检测时间长（> 5h）</p><p>检测试剂种类多</p><p>影响因素复杂</p><p>国产Elisa检测稳定性较差</p><p>检测费用昂贵</p>",
              },
            ],
          },
          argument: [
            {
              name: "检测方法",
              content: "纳米等离子耦合共振免疫吸附法",
            },
            {
              name: "空白吸光度",
              content:
                "以10mMTris-HCl为空白对照，计算试剂空白吸光度（OD）不大于0.005",
            },
            {
              name: "最低检出限",
              content: "当浓度 &lt; 0.001 mg/L时不能得到可重复的结果",
            },
            {
              name: "线性范围",
              content:
                "在0.01～1 mg/L范围内，剂量反应曲线线性相关系数应不低于0.9900；线性相对偏差不超过±15%",
            },
            {
              name: "前带效应",
              content:
                "当浓度&lt;1mg/L时无前带效应出现。如果样本浓度超过1 mg/L，则应以样本稀释液稀释成不同倍数后再重新测定，测定的结果值等于仪器检测值乘以稀释的倍数",
            },
            {
              name: "精密度",
              content: "批内精密度≤10%；批间精密度≤10%",
            },
            {
              name: "准确度",
              content: "测量结果的相对偏差应不超过±10%",
            },
            {
              name: "样品类型",
              content: "血清，肝素或EDTA抗凝血浆%",
            },
            {
              name: "检测类型",
              content: "定量",
            },
            {
              name: "检测时间",
              content: "约30min",
            },
            {
              name: "实验步骤",
              content: "一步法",
            },
          ],
        },
        {
          name: "",
          desc: "",
          topImg: [],
          overview: {
            txt: "",
            img: "",
          },
          advantage: {
            txt: "",
            lists: [],
          },
          argument: [],
        },
        {
          name: "SARS-CoV-2 N蛋白IgG抗体检测试剂盒",
          desc: "纳米等离子共振免疫吸附法",
          topImg: [
            {
              image: require("../../assets/detail/sars-cov-2-igg.jpg"),
            },
          ],
          overview: {
            txt:
              "本试剂盒用于体外定量检测人血清/血浆中SARS-CoV-2 N蛋白IgG抗体的含量。它使用我们专有的纳米等离子共振免疫吸附法技术。样本中的SARS-CoV-2 N蛋白IgG抗体在R1的缓冲液中，将与芯片表面修饰的N蛋白抗原结合形成抗原抗体结合物，再加入二抗试剂R2，反应形成抗原-抗体-二抗结构，并在纳米孔芯片上发生等离子共振效应，在特定波长610、620nm或630nm处引起吸光度的改变。特定波长处的吸光度的高低在芯片孔中修饰的SARS-CoV-2 N蛋白抗原一定量存在时，与样本中SARS-CoV-2 N蛋白IgG抗体的含量成正比。故可利用标准浓度的SARS-CoV-2 N蛋白IgG抗体生成的结合物粒子在纳米等离子芯片的610、620nm或630nm处的吸光度变化，建立吸光度变化值与浓度值的标准曲线，从而计算出未知浓度样本中的SARS-CoV-2 N蛋白IgG抗体含量。",
            img: require("../../assets/detail/sars-cov-2-igg.jpg"),
          },
          advantage: {
            txt: "公司专有的纳米等离子共振免疫吸附法技术的优势",
            lists: [],
            image: require("../../assets/detail/advantage_05.jpg"),
          },
          argument: [
            {
              name: "检测方法",
              content: "纳米等离子共振免疫吸附法",
            },
            {
              name: "灵敏度",
              content: "10ng/mL",
            },
            {
              name: "检测范围",
              content: "10ng/mL ~3000ng/mL",
            },
            {
              name: "样品类型",
              content: "血清，肝素或EDTA抗凝血浆。",
            },
            {
              name: "检测类型",
              content: "定量",
            },
            {
              name: "检测时间",
              content: "约30min",
            },
            {
              name: "实验步骤",
              content: "一步法",
            },
          ],
        },
        {
          name: "SARS-CoV-2 S-RBD蛋白IgG抗体检测试剂盒",
          desc: "纳米等离子共振免疫吸附法",
          topImg: [
            {
              image: require("../../assets/detail/sars-cov-2-srdb.jpg"),
            },
          ],
          overview: {
            txt:
              "本试剂盒用于体外定量检测人血清/血浆中SARS-CoV-2 S-RBD蛋白IgG抗体的含量。它使用我们专有的纳米等离子共振免疫吸附法技术。样本中的SARS-CoV-2 S-RBD蛋白IgG抗体在R1的缓冲液中，将与芯片表面修饰的S-RBD蛋白抗原结合形成抗原抗体结合物，再加入二抗试剂R2，反应形成抗原-抗体-二抗结构，并在纳米孔芯片上发生等离子共振效应，在特定波长610、620nm或630nm处引起吸光度的改变。该波长处的吸光度的高低在芯片孔中修饰的SARS-CoV-2 S-RBD蛋白抗原一定量存在时，与样本中SARS-CoV-2 S-RBD蛋白IgG抗体的含量成正比。故可利用标准浓度的SARS-CoV-2 S-RBD蛋白IgG抗体生成的结合物粒子在纳米等离子芯片的610、620nm或630nm处的吸光度变化，建立吸光度变化值与浓度值的标准曲线，从而计算出未知浓度样本中的SARS-CoV-2 S-RBD蛋白IgG抗体含量。",
            img: require("../../assets/detail/sars-cov-2-srdb.jpg"),
          },
          advantage: {
            txt: "公司专有的纳米等离子共振免疫吸附法技术的优势",
            lists: [],
            image: require("../../assets/detail/advantage_06.jpg"),
          },
          argument: [
            {
              name: "检测方法",
              content: "纳米等离子共振免疫吸附法",
            },
            {
              name: "灵敏度",
              content: "50ng/mL",
            },
            {
              name: "检测范围",
              content: "50ng/mL ~3200ng/mL",
            },
            {
              name: "样品类型",
              content: "血清，肝素或EDTA抗凝血浆。",
            },
            {
              name: "检测类型",
              content: "定量",
            },
            {
              name: "检测时间",
              content: "约30min",
            },
            {
              name: "实验步骤",
              content: "一步法",
            },
          ],
        },
        {
          name: "SARS-CoV-2 S蛋白抗原检测试剂盒",
          desc: "纳米等离子共振免疫吸附法",
          topImg: [
            {
              image: require("../../assets/detail/sars-cov-2-s.jpg"),
            },
          ],
          overview: {
            txt:
              "本试剂盒用于体外定量检测人血清/血浆中SARS-CoV-2 S蛋白抗原的含量。它使用我们专有的纳米等离子共振免疫吸附法技术。本试剂盒采用双抗夹心法原理。样本中的SARS-CoV-2 S蛋白抗原在R1的缓冲液中，将与芯片表面修饰的S蛋白抗体结合形成抗原抗体结合物，再加入试剂R2，反应形成抗体-抗原-抗体“夹心”结构，并在纳米孔芯片上发生等离子共振效应，在特定波长610、620nm或630nm处引起吸光度的改变。特定波长处的吸光度的高低在芯片孔中修饰的SARS-CoV-2 S蛋白抗体一定量存在时，与样本中SARS-CoV-2 S蛋白抗原的含量成正比。故可利用标准浓度的SARS-CoV-2 S蛋白抗原生成的结合物粒子在纳米等离子芯片的610、620nm或630nm处的吸光度变化，建立吸光度变化值与浓度值的标准曲线，从而计算出未知浓度样本中的SARS-CoV-2 S蛋白抗原含量。",
            img: require("../../assets/detail/sars-cov-2-s.jpg"),
          },
          advantage: {
            txt: "公司专有的纳米等离子共振免疫吸附法技术的优势",
            lists: [],
            image: require("../../assets/detail/advantage_07.jpg"),
          },
          argument: [
            {
              name: "检测方法",
              content: "纳米等离子共振免疫吸附法",
            },
            {
              name: "灵敏度",
              content: "10ng/mL",
            },
            {
              name: "检测范围",
              content: "62.5ng/mL ~3000ng/mL",
            },
            {
              name: "样品类型",
              content: "血清，肝素或EDTA抗凝血浆。",
            },
            {
              name: "检测类型",
              content: "定量",
            },
            {
              name: "检测时间",
              content: "约30min",
            },
            {
              name: "实验步骤",
              content: "一步法",
            },
          ],
        },
      ],
      swiperOptions: {
        initialSlide: 0,
        slidesPerView: "auto",
        centeredSlides: true,
        // autoplay: {
        //   delay: 3000,
        //   stopOnLastSlide: false,
        //   disableOnInteraction: false
        // },
        autoplay: false,
        pagination: {
          el: ".swiper-pagination",
        },
        // on: {
        //   slideChangeTransitionEnd: () => {
        //     this.$nextTick(() => {
        //       const swiper = this.$refs.mySwiper.$swiper;
        //       console.log(swiper);
        //       const realIndex = swiper.realIndex;
        //       this.current = realIndex;
        //     });
        //   },
        // },
        // loop: true
        // observer: true, // 修改swiper自己或子元素时，自动初始化swiper
        // observeParents: true // 修改swiper的父元素时，自动初始化swiper，
      },
    };
  },
  components: {
    Swiper,
    SwiperSlide,
  },
  directives: {
    swiper: directive,
  },
};
</script>

<style lang="scss" scoped>
.detail {
  .detail-bg {
    background-image: linear-gradient(180deg, #49c0e6 0%, #4478bd 100%);
  }
  .content {
    padding: 30px 15px 30px;
    .title {
      text-align: center;
      font-weight: blod;
      font-size: 15px;
      color: #fff;
    }
    .desc {
      margin-top: 10px;
      text-align: center;
      font-size: 12px;
      color: #fff;
    }
  }
  .overview {
    font-size: 12px;
    line-height: 18px;
    color: #111111;
  }
  .overview-img {
    margin-top: 20px;
    text-align: center;
  }

  .argument-item {
    display: grid;
    grid-template-columns: 25% 75%;
    grid-column-gap: 15px;
    font-size: 12px;
    min-height: 30px;
    .name {
      display: flex;
      justify-content: center;
      align-items: center;
    }
    .content {
      padding: 5px 15px 5px 0;
    }
  }

  .argument-item:nth-child(odd) {
    background: #f5f5f5;
  }
  .argument-item:nth-child(even) {
    background: #fff;
  }

  .detail-tab {
    margin-top: 16px;
  }
  .contact {
    color: #fff;
    display: grid;
    grid-template-columns: repeat(2, 50%);
    font-size: 12px;
    padding: 0 35px 30px 35px;
    text-align: center;
  }

  .swiper-container {
    padding: 20px 0 40px;
  }
  .swiper-slide {
    width: 270px;
    height: 270px;
    text-align: center;
    font-size: 4.8vw;
    background: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-transition: 300ms;
    transition: 300ms;
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
    box-shadow: 0px 10px 15px 0px rgba(48, 48, 48, 0.2);
    border-radius: 10px;
    overflow: hidden;
  }
  .swiper-slide-active {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
</style>

<style lang="scss">
.detail {
  .van-row {
    .van-col {
      padding: 0 3px;
      font-size: 12px;
      text-align: center;
    }
  }
  .swiper-img {
    width: 100%;
    height: 100%;
  }
  .swiper-pagination-bullet {
    width: 9px;
    height: 5px;
    border-radius: 5px;
    background-color: rgba($color: #fff, $alpha: 0.5);
  }
  .swiper-pagination-bullet-active {
    width: 25px;
    background-color: rgba($color: #fff, $alpha: 1);
  }
  .van-tabs__nav {
    background: none;
    padding: 0 18px;
  }
  .van-tab {
    color: #fff;
    border-radius: 5px 5px 0 0;
    background: rgba($color: #fff, $alpha: 0.2);
    margin-right: 5px;
  }
  .van-tab:nth-child(3) {
    margin-right: 0px;
  }
  [class*="van-hairline"]::after {
    border: none;
  }
  .van-tab--active {
    background-color: #fff;
    color: #4278bc;
  }
  .van-tab__pane,
  .van-tab__pane-wrapper {
    background-color: #fff;
    border-radius: 5px;
    padding: 15px;
    min-height: 550px;
    box-shadow: 0px 10px 15px 0px rgba(48, 48, 48, 0.2);
  }
  .van-tabs__line {
    display: none;
  }
  .advantage {
    &-txt {
      font-size: PingFang-SC-Regular;
      font-size: 12px;
      color: #3f4650;
      text-align: center;
    }
    &-table {
      margin-top: 24px;
      &-item {
        margin-bottom: 15px;
        display: grid;
        grid-template-columns: 40% 60%;
        grid-column-gap: 10px;
      }
      .active {
        color: #4278bc;
      }
      &-info {
        color: #3f4650;
        p {
          font-weight: bold;
          font-size: 14px;
        }
        span {
          font-weight: 200;
          font-size: 12px;
        }
      }
    }
  }
}
</style>
